<template>
  <Table v-bind="target">
    <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
      <slot :name="item" v-bind="data || {}"></slot>
    </template>
  </Table>
</template>
<script setup lang="ts">
import {PaginationProps, Table, TableProps} from 'ant-design-vue'
import {computed} from "vue";
import NumUtils from "../../utils/NumUtils.ts";
import {jTableProps} from "./table.ts";

defineOptions({
  name: "JTable",
})

const props = defineProps({...jTableProps}) as TableProps;

const _pagination = props?.pagination as PaginationProps;
const pagination: PaginationProps = {
  pageSize: NumUtils.parseHead(_pagination?.pageSizeOptions, 20),
  pageSizeOptions: _pagination?.pageSizeOptions || [20, 50, 200, 500],
  current: 1,
  showSizeChanger: true,
  showQuickJumper: true,
  showTotal: (total) => `总数：${total}`
}
const target = computed(() => {
  return {
    ...props,
    pagination: {...pagination, ..._pagination}
  }
})
</script>